<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>  
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>垃圾分类查询</title>
<link href="<%=path %>/static/usercss/css/all.css??32239j" rel="stylesheet" type="text/css">
<!--[if IE]>
<script>
(function(){if(!/*@cc_on!@*/0)return;var e = "abbr,article,aside,audio,canvas,datalist,details,dialog,eventsource,figure,footer,header,hgroup,mark,menu,meter,nav,output,progress,section,time,video".split(','),i=e.length;while(i--){document.createElement(e[i])}})()
</script>
<[endif]-->
<script type="text/javascript" src="<%=path%>/static/js/jquery-3.2.1.js"></script>
<style type="text/css">
	#submit{
		background-color:#ffffff;
		height:30px;
		width:70px;
	}
	#input1{
	height:30px;
	width:230px;
	margin-left:155px;
	}
	#input2{
	height:30px;
	width:220px;
	margin-left:385px;
	}
	#input3{
	height:30px;
	margin-left:0px;
	}
	#submit{
	margin-left:300px;
	}
	
</style>

</head>
<body>
<jsp:include page="/WEB-INF/web/includ/header.jsp"></jsp:include>
<section>
<div class="wrap">
<div class="section">
    <article id="datalist">
      <nav>
      <form action="<%=path %>/web/rubbish/addObject" method="post" enctype="multipart/form-data">
        <div class="msg">
          <h1>创建分类</h1> <a href="#">创建新的分类及名称</a>
          
            <div class="seach">
            <input type="hidden" value="2" name="type" id="type">
            
            
            <select name="firsttypeId" id="firsttype">
                <option value="0" id="firsthint">请选择垃圾类型</option>
               <c:forEach items="${requestScope.firsttypes }" var="firsttype">
              	 <option value="${firsttype.id }">${firsttype.title}</option>
               </c:forEach>
            </select>
            <select name="secondtypeId" disabled id="secondtype">
                <option value="0" id="secondhint">请选择垃圾详细类型</option>
                 <option value="-1" id="addsec">添加新的垃圾详细类型。。</option>
               <c:forEach items="${requestScope.secondtypes}" var="secondtype" varStatus="stat">
					<option nickname="secopt" value="${secondtype.id }" condition="${secondtype.firsttype.id }">${secondtype.title}</option>
					</c:forEach>
            </select>
           
            </div>
            <div class="seach" height="80">
            <label style="width:200px;" id="type1name"></label>
            <input type="text" id="input1"  name="fenlei1-2" aria-label="输入添加分类名" placeholder="输入添加的二级分类名">
            <input type="text" id="input2"  name="fenlei1-1" aria-label="输入添加分类名" placeholder="输入添加的垃圾名">
            <br><br>
           <div class="row cl" id="unitList">
			<label class="form-label col-xs-4 col-sm-2">垃圾处理单位：</label>
			<div style="width:580px"> <span >
				<c:forEach items="${requestScope.units}" var="unit" varStatus="stat">
				<label style="width:40px"><input style="width:20px" type="checkbox" id="${unit.id }" condition="${stat.index }">${unit.name }</label></c:forEach>
				</span> </div>
		</div>
		<br>
		<input type="hidden" name="unitString" id="unitString" value="">
            <span>上传图片<input type="file" id="input3" name="file" accept="image/*"></span><br><br>
        
           
            </div>
            
  		
        </div>
        <b>垃圾详情及处理方式</b><br>
       <script id="editor" type="text/plain" style="width:90%;height:200px;" name="content"></script> 
       	<input value="创建" type="submit" id="submit" disabled>
         </form>
        
      
      <br>
        <b>${sessionScope.userinfo.name}的近期添加历史&nbsp;&nbsp;&nbsp;&nbsp;</b><a style="font-style: italic;color:blue;text-decoration:underline;text-decoration-color:blue;" href="<%=path %>/web/rubbish/showHistory?pageNum=1">查看全部</a>
        <div id="breadcrumb">
        <table style="width:650px;">
        <c:forEach items="${requestScope.userHistory}" var="ht">
       
        <tr>
          <td style="text-align:left;"><a href="#">${ht.content}</a>
           <td><fmt:formatDate pattern="yyyy-MM-dd"  value="${ht.inputTime}" /></td>
          <td><c:if test="${ht.status==1 }"><span>采用</span></c:if><c:if test="${ht.status==-1 }"><span>未采用</span></c:if><c:if test="${ht.status==0 }"><span>待审核</span>&nbsp;<a style="font-style: italic;color:blue;text-decoration:underline;text-decoration-color:blue;" href="<%=path %>/web/rubbish/delObject?type=${ht.type}&objectId=${ht.objectId}">删除</a></c:if>
        </tr>
       
       </c:forEach>
       </table>
      </div>
    </nav>
  </article>
  <jsp:include page="/WEB-INF/web/includ/aside.jsp"></jsp:include>
      </div>
</div>
<jsp:include page="/WEB-INF/web/includ/footer.jsp"></jsp:include>
</section>

</body>
<script type="text/javascript" src="<%=path%>/static/managecss/lib/ueditor/1.4.3/ueditor.config.js"></script>
<script type="text/javascript" src="<%=path%>/static/managecss/lib/ueditor/1.4.3/ueditor.all.min.js"> </script>
<script type="text/javascript" src="<%=path%>/static/managecss/lib/ueditor/1.4.3/lang/zh-cn/zh-cn.js"></script>
<script type="text/javascript">
var unitString="";
$(function(){
	var nunit=${fn:length(requestScope.units)};
	var unitArray=new Array(nunit);
	for(var i=0;i<nunit;i++){
		unitArray[i]=0;
		
	}
	
	$("input[type=checkbox]").click(function(){
	
		if($(this).prop("checked")==true){
				unitArray[parseInt($(this).attr("condition"))]=$(this).attr("id");
		}
		else{
			unitArray[parseInt($(this).attr("condition"))]=0;
		}
		unitString="";
		for( var i=0;i<nunit;i++){
			if(unitArray[i]==0){
	
			}
			else{
				unitString+=","+unitArray[i];
			}
		}
		$("#unitString").val(unitString);
		
		});
})
$(function(){
	var ue = UE.getEditor('editor',{toolbars:[['emotion','spechars','bold','italic','forecolor','strikethrough','horizontal','selectall','time','date','help']],										
		elementPathEnabled:false,
		wordCount:false});
});

$(function() {
	$("#input1").hide();
	$("#input2").hide();
	$("#unitList").hide();
	 $("#firsttype").click(function() {
		 $("#input1").hide();
		 $("#input2").hide();
		 
		 $("#input1").attr("name","noobjectName");
		$("#input2").attr("name","noobjectName");
		 $("#firsthint").hide();
		
		 $("#secondtype").val("");
		 $("#secondtype").prop("disabled",false);
		 $("#secondtype").find("option").hide();
		 $("#addsec").show();
		 if($("#firsttype").val()=="1")
		 {	//$("option").hide();
			// $("option[condition==1]").show();
			
			 $("#secondtype").find("option[condition=1]").show();
		 }
		 if($("#firsttype").val()=="2")
		 {	 
		 $("#secondtype").find("option[condition=2]").show();
		 
		 }
		 if($("#firsttype").val()=="3")
		 {	
		 $("#secondtype").find("option[condition=3]").show();
		 }
		 $("#secondhint").show();
		 $("#secondhint").prop("selected",true);
	 });
	 $("#secondtype").click(function() {
		 $("#secondhint").hide();
		
		 
	 });
	$("#secondtype").change(function(){
		if($("#secondtype").val()==-1){
			$("#input1").show();
			$("#input2").hide();
			$("#unitList").hide();
			$("#input1").attr("name","objectName");
			$("#input2").attr("name","noobjectName");
			$("#type").val("2");
		
		}
		else{
			$("#input1").hide();
			$("#input2").show();
			$("#unitList").show();
			$("#input1").attr("name","noobjectName");
			$("#input2").attr("name","objectName");
			$("#type").val("1");
			
		}
	});
});
$(function(){
	$("#input1").change(function(){
		if($("#input1").val()!=""&&$("#input1").val()!="undefined"){
			$("#submit").prop("disabled",false);
		}
		else{
			$("#submit").prop("disabled",true);
		}
	})
});
$(function(){
	$("#input2").change(function(){
		if($("#input2").val()!=""&&$("#input2").val()!="undefined"){
			$("#submit").prop("disabled",false);
		}
		else{
			$("#submit").prop("disabled",true);
		}
	})
});
$(function(){
	$("#input1").change(function(){
		$.ajax({
			type:"POST",
			url:"<%=path%>/web/rubbish/judge",
			data : "objectName="+$("#input1").val()+"&secondTypeId="+"-1",
			dataType:"json",
			success : function(result) {
				if(result==true){
					alert("该分类已经存在！换个名字吧！");
					$("#input1").val("");
				}
			}
		})	
			
	})	
})	
$(function(){
	$("#input2").change(function(){
		$.ajax({
			type:"POST",
			url:"<%=path%>/web/rubbish/judge",
			data : "objectName="+$("#input2").val()+"&secondTypeId="+$("#secondtype").val(),
			dataType:"json",
			success : function(result) {
				if(result==true){
					alert("该垃圾已经存在！换个名字吧！");
					$("#input2").val("");
				}
			}
		})	
			
	})	
})	
</script>
</html>